<%@ page language="java" import="java.util.*,com.common.config.WebConfiguration"
	pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%
	String webResource = WebConfiguration.webResource;
%>
<!DOCTYPE html>
<html>

<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0" charset="utf-8">
<title>学校管理</title>
<link rel="shortcut icon" href="favicon.ico">
<link href="<%=webResource%>/assets/css/bootstrap.min.css?v=3.3.6" rel="stylesheet">
<link href="<%=webResource%>/assets/css/font-awesome.css?v=4.4.0" rel="stylesheet">
<link href="<%=webResource%>/assets/css/animate.css" rel="stylesheet">
<link href="<%=webResource%>/assets/css/style.css?v=4.1.0" rel="stylesheet">
<!-- 全局js -->
<script src="<%=webResource%>/assets/js/jquery.min.js?v=2.1.4"></script>
<link href="<%=webResource%>/assets/js/plugins/layer/skin/default/layer.css" rel="stylesheet">
 <script src="<%=webResource%>/assets/js/plugins/layer/layer.js"></script>
 <script src="<%=webResource %>/assets/js/plugins/pace/pace.min.js"></script>
<link href="<%=webResource%>/assets/css/plugins/bootstrap-table/bootstrap-table.min.css" rel="stylesheet">
</head>

<body class="gray-bg">
		<div class="ibox-content">
			<div class="row row-lg">
				<div class="col-sm-12">
				     <div id="toolbar" class="btn-group" role="toolbar">
                        <span><button id="btn_add" type="button" class="btn btn-default">
                            <span class="glyphicon glyphicon-pencil" aria-hidden="true"></span>添加
                        </button></span>
                        <span><button id="btn_edit" disabled="disabled" type="button" class="btn btn-default">
                            <span class="glyphicon glyphicon-pencil"></span>编辑
                        </button></span>
                           <span><button id="btn_del" disabled="disabled" type="button" class="btn btn-default">
                            <span class="glyphicon glyphicon-pencil"></span>删除
                        </button></span>
                           <span><button id="btn_search" type="button" class="btn btn-default">
                            <span class="glyphicon glyphicon-pencil" aria-hidden="true"></span>查询
                        </button></span>
                    </div>
					 <table id="tblist"
           data-toolbar="#toolbar"
           data-search="true"
           data-show-refresh="true"
           data-show-toggle="true"
           data-show-columns="true"
           data-minimum-count-columns="2"
           data-show-pagination-switch="true"
           data-pagination="true"
           data-id-field="id"
           data-pageSize="10"
           data-page-list="[10, 25, 50, 100, ALL]"
           data-show-footer="false"
           data-side-pagination="server"
           data-url="/admin/schools/page">
           </table>	
				</div>
			</div>
		</div>




	<script src="<%=webResource%>/assets/js/bootstrap.min.js?v=3.3.6"></script>

	<!-- 自定义js -->
	<script src="<%=webResource%>/assets/js/content.js?v=1.0.0"></script>
	<!-- Bootstrap table -->
	<script src="<%=webResource%>/assets/js/plugins/bootstrap-table/bootstrap-table.min.js"></script>
	<script src="<%=webResource%>/assets/js/plugins/bootstrap-table/locale/bootstrap-table-zh-CN.min.js"></script>
    <script src="<%=webResource%>/assets/js/common.js"></script>
   

<script type="text/javascript">	
	var $table = $('#tblist'),$edit=$('#btn_edit'),
	$add = $('#btn_add'),$del=$('#btn_del'),selections = [];
	$del.click(function() {
		//询问框
		layer.confirm('您确定要删除吗？', {
		  btn: ['确定','取消'] //按钮
		}, function(){
			function delback(data){
				$table.bootstrapTable('refresh');
			}
			var data={ids:selections};
			ajaxLink("/admin/schools/del",data,delback);
		});
	});
	function initBtn(){
		 $edit.prop('disabled', true);
		$del.prop('disabled', true);
	}
	function createOrEdit(title,url){
		layer.open({
			type : 2,
			title :title,
			shadeClose : true,
			shade : [0.3,'#333'],
			maxmin : true, //开启最大化最小化按钮
			area : [ '893px', '600px' ],
			content : url,
			end : function() {
				$table.bootstrapTable('refresh');
				initBtn();
			}
		});
	}
	$edit.click(function() {
		if(selections.length>1){
			layer.msg("最多只能选一个", {time : 1500});
			return;
		}
		createOrEdit("编辑学校","/admin/schools/CreatOrEdit/"+selections[0]);
	});
	
	$add.click(function() {
		createOrEdit("添加学校","/admin/schools/CreatOrEdit");
	});
	function initTable() {
		$table.bootstrapTable({
			queryParams:queryParams,
			striped:true,
					columns : [ {
                        field: 'state',
                        checkbox: true,
                        align: 'center',
                        valign: 'middle'
                    }, {
								title : '课程名',
								field : 'name',
								align : 'center',
								valign : 'middle',
								sortable : true
							}, {
								title : '标签',
								field : 'label',
								align : 'center',
								valign : 'middle',
								sortable : true
							}]
				});
		// sometimes footer render error.
		setTimeout(function() {
			$table.bootstrapTable('resetView');
		}, 200);
	
		   $table.on('check.bs.table uncheck.bs.table ' +
	                'check-all.bs.table uncheck-all.bs.table', function () {
			   $edit.prop('disabled', !$table.bootstrapTable('getSelections').length);
			   $del.prop('disabled', !$table.bootstrapTable('getSelections').length);
	            selections = getIdSelections();
	        });
	}
	//得到查询的参数
	var queryParams = function(params) {
	var	pageNumber=params.offset/params.limit+1;
		var temp = { 
			pageNumber : pageNumber, //页码
			pageSize : params.limit, //页面大小
			keyword : params.search,
			sortName:params.sort,
			order:params.order
		};
		return temp;
	};
	function getIdSelections() {
		return $.map($table.bootstrapTable('getSelections'), function(row) {
			return row.id
		});
	}
	function operateFormatter(value, row, index) {
		return [ '<a class="like" href="javascript:void(0)" title="Like">',
				'<i class="glyphicon glyphicon-heart"></i>', '</a>  ',
				'<a class="remove" href="javascript:void(0)" title="Remove">',
				'<i class="glyphicon glyphicon-remove"></i>', '</a>' ].join('');
	}

	window.operateEvents = {
		'click .like' : function(e, value, row, index) {
			alert('You click like action, row: ' + JSON.stringify(row));
		},
		'click .remove' : function(e, value, row, index) {
			$table.bootstrapTable('remove', {
				field : 'id',
				values : [ row.id ]
			});
		}
	};
	function editiframe(id) {
		var url = "Article/edit/" + id;
		layer.open({
			type : 2,
			title : '文章編輯',
			shadeClose : true,
			shade : false,
			maxmin : true, //开启最大化最小化按钮
			area : [ '893px', '600px' ],
			content : url,
			end : function() {

			}
		});
	}
	function enteriframe(id) {
		var url = "Article/enter/" + id;
		layer.open({
			type : 2,
			title : '文章录入',
			shadeClose : true,
			shade : [ 0.5, '#666' ],
			maxmin : true, //开启最大化最小化按钮
			area : [ '893px', '600px' ],
			content : url,
			end : function() {

			}
		});
	}
	function operateFormatter(value, row, index) {
		var enterbtn = '';
		if (!row.isentering) {
			enterbtn = '<button class="btn btn-primary"  onclick="enteriframe('
					+ row.article_id
					+ ')"><i class="glyphicon glyphicon-pencil"></i>&nbsp;录入</button>';
		}
		var editbtn = '<button class="btn btn-primary"  onclick="editiframe('
				+ row.article_id
				+ ')"><i class="glyphicon glyphicon-pencil"></i>&nbsp;编辑</button>';
		var delbtn = '<a class="btn btn-primary" href="Article/del/'+row.article_id+'"><i class="glyphicon glyphicon-minus"></i>&nbsp;删除</a>';
		return [ editbtn, enterbtn, delbtn ].join(' ');

	}

	$(function() {
		//1.初始化Table
		initTable();
		//查询
		$("#search").on("click", function() {
			TableInit();
		});
	});
</script>
</body>

</html>
